﻿/*
 * 采用不同颜色显示表格列插件
 * 
 * css:
 .ux-grid3-color-col-td{
 
 }
 .ux-grid3-color-col{
 	
 }
 .x-grid3-body .x-grid3-check-col-td .x-grid3-cell-inner {
padding:1px 0 0 !important;
}
.x-grid3-check-col {
	background-color:transparent;
	background-position:center center;
	background-repeat:no-repeat;
	height:16px;
	width:100%;
}
.x-grid3-check-col-on {
	background-color:transparent;
	background-position:center center;
	background-repeat:no-repeat;
	height:16px;
	width:100%;
}
 
 */

Ext.ns('Ext.ux.grid');

Ext.ux.grid.ColorColumn = function(config) {
	Ext.apply(this, config);
	if (!this.id) {
		this.id = Ext.id();
	}
	this.renderer = this.renderer.createDelegate(this);
};

Ext.ux.grid.ColorColumn.prototype = {
	init: function(grid) {
		this.grid = grid;
		this.grid.on('render',
		function() {
			var view = this.grid.getView();
			view.mainBody.on('mousedown', this.onMouseDown, this);
		},
		this);
	},

	onMouseDown: function(e, t) {
		if (t.className && t.className.indexOf('ux-grid3-cc-' + this.id) != -1) {
			e.stopEvent();
			var index = this.grid.getView().findRowIndex(t);
			var record = this.grid.store.getAt(index);
			record.set(this.dataIndex, !record.data[this.dataIndex]);
		}
	},

	renderer: function(v, p, record) {
		p.css += ' ux-grid3-color-col-td';
		return '<div class="ux-grid3-color-col' + (v ? '-on': '') + ' ux-grid3-cc-' + this.id + '">&#160;</div>';
	}
};